import ReactDOM from "react-dom/client";
import { RouterProvider, createBrowserRouter } from "react-router-dom";

import "./index.css";

import Root from "./routers/root";
import Home from "./routers/home";
import People, { loader as peopleLoader } from "./routers/people";
import Posts, { loader as postsLoader } from "./routers/posts";

const router = createBrowserRouter([
  {
    path: "/",
    element: <Root />,
    children: [
      {
        index: true,
        element: <Home />,
      },
      { path: "/people", element: <People />, loader: peopleLoader },
      { path: "/posts", element: <Posts />, loader: postsLoader },
    ],
  },
]);

ReactDOM.createRoot(document.getElementById("root")).render(
  <RouterProvider router={router} />
);
